﻿@page
@using FytSoa.Application.Sys
@using FytSoa.Common.Param
@using FytSoa.Application.Exam
@using FytSoa.Application.Exam.Param
@using FytSoa.Application.Sys.Param
@using FytSoa.Common.Utils
@model IndexModel
@inject SysAdvInfoService _advService
@inject ExamCourseService _courseService
@inject ExamTeacherService _teacherService
@inject ExamKnowledgeService _knowledgeService
@{
    ViewData["Title"] = "Home";
    var advList = await _advService.GetPagesAsync(new CodePageParam() { Id = 1548931502119718914 });
    var liveList = await _courseService.GetPagesAsync(new ExamCourseSearchParam() { Type = 2, Audit = "1", Limit = 10 });
    var videoList = await _courseService.GetPagesAsync(new ExamCourseSearchParam() { Type = 1, Audit = "1", Limit = 10 });
    var teacherList = await _teacherService.GetPagesAsync(new PageParam() { Limit = 10 });
    var graphicList = await _courseService.GetPagesAsync(new ExamCourseSearchParam() { Type = 3, Audit = "1", Limit = 6 });
    var knowledgeList = await _knowledgeService.GetPagesAsync(new ExamKnowledgeParam() { Limit = 8 });
}
<div class="main_content_inner">


<!-- Slideshow -->
<div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1"
     uk-slideshow="animation: push ;min-height: 200; max-height: 350 ;autoplay: t rue">

    <ul class="uk-slideshow-items rounded">
        @{
            foreach (var item in advList.Items)
            {
                <li>
                    <div class="uk-position-cover" uk-slideshow-parallax="scale: 1.2,1.2,1">
                        <img src="@item.ImgUrl.UrlReplace()" alt="@Html.Raw(item.Title)" uk-cover>
                    </div>
                    <div class="uk-position-cover"
                         uk-slideshow-parallax="opacity: 0,0,0.2; backgroundColor: #000,#000">
                    </div>
                    <div class="uk-position-bottom-left bg-gradient-4 uk-width-1-1 p-4">
                        <div uk-slideshow-parallax="scale: 1,1,0.8">
                            <h1 uk-slideshow-parallax="x: 200,0,0" class="uk-heading-small">
                                @Html.Raw(item.Title)
                            </h1>
                        </div>
                    </div>
                </li>
            }
        }
    </ul>

    <a class="uk-position-center-left-out uk-position-small uk-hidden-hover slidenav-prev" href="#"
       uk-slideshow-item="previous">
    </a>
    <a class="uk-position-center-right-out uk-position-small uk-hidden-hover slidenav-next" href="#"
       uk-slideshow-item="next">
    </a>
</div>


<!-- Videos sliders 1 -->

<div class="video-grid-slider mt-4" uk-slider="finite: true">

    <div class="grid-slider-header">
        <div>
            <h3> 直播频道推荐 </h3>
            <p> Live Channel Recommendation </p>
        </div>
        <div class="grid-slider-header-link">

            <div class="btn-arrow-slider">
                <a href="#" class="btn-arrow-slides" uk-slider-item="previous">
                    <span class="arrow-left"></span>
                </a>
                <a href="#" class="btn-arrow-slides" uk-slider-item="next">
                    <span class="arrow-right"></span>
                </a>
            </div>

        </div>
    </div>

    <ul class="uk-slider-items uk-child-width-1-4@m uk-child-width-1-3@s uk-grid">
        @{
            foreach (var item in liveList.Items)
            {
                <li>
                    <a href="/live/single/@item.Id" class="video-post">
                        <!-- Blog Post Thumbnail -->
                        <div class="video-post-thumbnail">
                            <span class="video-post-count">@item.Hits</span>
                            <span class="video-post-time"></span>
                            <span class="play-btn-trigger"></span>
                            <!-- option menu -->
                            <span class="btn-option">
                                <i class="icon-feather-more-vertical"></i>
                            </span>
                            <div class="dropdown-option-nav"
                                 uk-dropdown="pos: bottom-right ;mode : hover ;animation: uk-animation-slide-bottom-small">
                                <ul>
                                    <li>
                                        <span> <i class="uil-history"></i> 立即观看</span>
                                    </li>
                                    <li>
                                        <span> <i class="uil-bookmark"></i> 加入书签</span>
                                    </li>
                                    <li>
                                        <span> <i class="uil-share-alt"></i> 分享</span>
                                    </li>
                                </ul>
                            </div>

                            <img src="@item.Cover.UrlReplace()" alt="@Html.Raw(item.Title)">

                        </div>

                        <!-- Blog Post Content -->
                        <div class="video-post-content">
                            <h3> @Html.Raw(item.Title) </h3>
                            <img src="@item.Teacher.Avatar.UrlReplace()" alt="@Html.Raw(item.Teacher.Name)">
                            <span class="video-post-user">@Html.Raw(item.Teacher.Name)</span>
                            <span class="video-post-views">@Html.Raw(item.Teacher.PostName)</span>
                            <span class="video-post-date"> @item.Teacher.Age </span>
                        </div>
                    </a>
                </li>
            }
        }

    </ul>

</div>


<!-- section header for slider 1 -->

<div class="section-header mt-5">
    <div class="section-header-left">
        <h3> 点播频道推荐 </h3>
        <p> Video channel recommendation </p>
    </div>
    <div class="section-header-right">
        <a href="/video" class="see-all"> 更多</a>
    </div>
</div>

<!-- Videos sliders 1 -->

<div class="section-small pt-0">
    <div uk-slider="finite: true">

        <ul class="uk-slider-items uk-child-width-1-4@m uk-child-width-1-3@s uk-grid mb-3">
            @{
                foreach (var item in videoList.Items)
                {
                    <li>
                        <a href="/video/single/@item.Id" class="video-post">
                            <!-- Blog Post Thumbnail -->
                            <div class="video-post-thumbnail">
                                <span class="video-post-count">@item.Hits</span>
                                <span class="video-post-time"></span>
                                <span class="play-btn-trigger"></span>
                                <!-- option menu -->
                                <span class="btn-option">
                                    <i class="icon-feather-more-vertical"></i>
                                </span>
                                <div class="dropdown-option-nav"
                                     uk-dropdown="pos: bottom-right ;mode : hover ;animation: uk-animation-slide-bottom-small">
                                    <ul>
                                        <li>
                                            <span> <i class="uil-history"></i> 立即观看</span>
                                        </li>
                                        <li>
                                            <span> <i class="uil-bookmark"></i> 加入书签</span>
                                        </li>
                                        <li>
                                            <span> <i class="uil-share-alt"></i> 分享</span>
                                        </li>
                                    </ul>
                                </div>

                                <img src="@item.Cover.UrlReplace()" alt="@Html.Raw(item.Title)">

                            </div>

                            <!-- Blog Post Content -->
                            <div class="video-post-content">
                                <h3> @Html.Raw(item.Title) </h3>
                                <img src="@item.Teacher.Avatar.UrlReplace()" alt="@Html.Raw(item.Teacher.Name)">
                                <span class="video-post-user">@Html.Raw(item.Teacher.Name)</span>
                                <span class="video-post-views">@Html.Raw(item.Teacher.PostName)</span>
                                <span class="video-post-date"> @item.Teacher.Age </span>
                            </div>
                        </a>
                    </li>
                }
            }
        </ul>

        <a class="uk-position-center-left-out uk-position-small slidenav-prev" href="#"
           uk-slider-item="previous">
        </a>
        <a class="uk-position-center-right-out uk-position-small slidenav-next" href="#"
           uk-slider-item="next">
        </a>

    </div>

</div>

<hr class="m-0">

<!-- Find channals sliders 1 -->

<div class="section-small">

    <div uk-slider="finite: true">

        <div class="grid-slider-header">
            <div>
                <h3> 讲师展示 </h3>
            </div>
            <div class="grid-slider-header-link">

                <a href="/lecturer" class="button transparent uk-visible@m"> 所有 </a>
                <a href="#" class="slide-nav-prev" uk-slider-item="previous"></a>
                <a href="#" class="slide-nav-next" uk-slider-item="next"></a>


            </div>
        </div>

        <ul class="uk-slider-items uk-child-width-1-5@m uk-child-width-1-2@s uk-grid mb-3">
            @{
                foreach (var item in teacherList.Items)
                {
                    <li>
                        <a href="/lecturer/single/@item.Id">
                            <div class="single-channal">
                                <div class="single-channal-creator">
                                    <img src="@item.Avatar.UrlReplace()" alt="@Html.Raw(item.Name)">
                                </div>
                                <div class="single-channal-body">
                                    <h4>@Html.Raw(item.Name) </h4>
                                    <p> @Html.Raw(item.PostName) - @Html.Raw(item.ProfessionCode.Name) </p>
                                    <a href="/lecturer/single/@item.Id" class="button primary small circle"> 详情 <i class="uil-arrow-right"></i></a>
                                </div>
                            </div>
                        </a>
                    </li>
                }
            }
        </ul>

    </div>

</div>


<!-- find channals  header -->

<div class="section-header mt-5">
    <div class="section-header-left">
        <h4> 图文推荐</h4>
        <p> Graphic recommended . </p>
    </div>
    <div class="section-header-right">
        <a href="browse-channals.html" class="see-all"> 更多</a>
    </div>
</div>

<!-- find channals -->
<div class="uk-child-width-1-2@m" uk-grid>
    @{
        foreach (var item in graphicList.Items)
        {
            <div>
                <div class="uk-grid-small" uk-grid>
                    <div class="uk-width-auto">
                        <img src="@item.Cover" class="rounded-lg" width="80" alt="">
                    </div>
                    <div class="uk-width-expand">
                        <h4 class="mb-2 uk-text-truncate"> @Html.Raw(item.Title)</h4>
                        <p class="uk-text-small">
                            <span> @Html.Raw(item.Summary.CutString(50)) </span>
                        </p>
                    </div>
                    <div class="uk-width-auto">
                        <a href="/graphic/single/@item.Id" class="button soft-primary circle">
                            <i
                                class="uil-plus">
                            </i>
                        </a>
                    </div>
                </div>
            </div>
        }
    }
</div>


<!-- find channals  header -->

<div class="section-header mt-5">
    <div class="section-header-left">
        <h4> 知识库</h4>
        <p> The knowledge base . </p>
    </div>
    <div class="section-header-right">
        <a href="/knowledge" class="see-all"> 更多</a>
    </div>
</div>
<div class="uk-child-width-1-4@m" uk-grid
     uk-scrollspy="target: > div; cls: uk-animation-slide-bottom-small; delay: 100">
    @{
        foreach (var item in knowledgeList.Items)
        {
            <div class="know-item">
                <div>
                    <a href="@item.Document.UrlReplace()" target="_blank" title="@Html.Raw(item.Title)">
                        <div class="cover">
                            <img src="@item.Cover.UrlReplace()" alt="@Html.Raw(item.Title)">
                        </div>
                        <div class="title">@Html.Raw(item.Title)</div>
                        <div class="tag">
                            <span>@Html.Raw(item.Category.Name)</span><span>@Html.Raw(item.GrandCode.Name)</span>
                        </div>
                    </a>
                </div>
            </div>
        }
    }
</div>
</div>